<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="test">
        <p>abc</p>
        <p>def</p>
    </div>
    <a href="#" name='link'>aaa</a>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
    <div class="test2">test2-1</div>
</body>

<script>
    var test1 = document.getElementById('test')
    console.log(test1)

</script>

<script>
    var div_box = document.getElementById("test")
    console.log(div_box)
    var a_box = document.getElementsByName("link")
    console.log(a_box[0])
    var p_box = document.getElementsByTagName("p")
    console.log(p_box[0], p_box[1])
    var clas_box = document.getElementsByClassName("test")
    console.log(clas_box[0])

</script>

</html>